<!-- saved from url=(0014)about:internet -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>MultiPowUpload tutorials</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<table width="100%" cellpadding="0" cellspacing="0">
        <tr>
            <td width="400">

                <span class="caption">MultiPowUpload </span><span class="yellow">3.1</span>
                <br /><span class="gray">Tutorials</span>            </td>
            <td>&nbsp;            </td>
             <td align="char" width="200"><img src="world.jpg" align="middle" hspace="5" /><b><a target="_blank" href="http://www.element-it.com/multiple-file-upload/flash-uploader.aspx">Home
      page</a></b><br />
                          <img src="email.jpg" align="middle" hspace="5" /><b><a target="_blank" href="http://www.element-it.com/contacts.aspx">Contact
                            support</a></b> </td>
        </tr>
</table>
  
  <p class="topic"><b>MultiPowUpload tutorials</b>&nbsp;
  <ol>
<li><a href="#types">Data types</a></li>
<li><a href="#hidden">Hidden mode</a></li>
<li><a href="#thumb">Upload thumbnails</a></li>
<li><a href="#chunk">Upload modes, chunked upload mode</a></li>
<li><a href="#skin">Skinning UI</a></li>
<li><a href="#description">Form fields for each file. Configuring description window. </a></li>
<li><a href="#response_control">Control MultiPowUpload using server response. </a></li>
<li><a href="#international">Internationalization of UI. </a></li>
<li><a href="#layout">Auto layout. Relative coordinates. </a></li>
</ol>
<p>&nbsp;</p>
<ol>
<li>
<p class="topicLeft" id="types">Data types</p>


	Here is the list of all data types used by MultiPowUpload:
	<ul>
	<li>
	<b>String</b> - Simple string data type.	</li>
	<li>
	<b>Number</b> - Number data type is a common type for simple integer values and floating point numbers.	</li>
	<li>
	<b>Boolean</b> - Boolean data type. Valid values for this data type are "true", "false", "yes", "no".	</li>
	<li>
	<b>URL</b> - Absolute or relative url to some resource. The absolute url should start with http:// or / , otherwise the url will be relative to the location of the html page where it is placed. This data type is also used to set up the location of the image files, in this case the default parameter value may be empty or "internal".  It means that MultiPowUpload use some build-in resources. </li>
	<li>
	<b>Color</b> - Datatype to set up colors for some of the UI elements. It is a standard HTML hexidecimal color value with "#" or "0x" prefixes.	</li>
	<li>
	<b>TextStyle</b> - Combined data type. It contains the following properties:
		<ul>
		<li>
		<b>font</b> - Name of the font family.		</li>
		<li>
		<b>size</b> - Font size in pixels.		</li>
		<li>
		<b>color</b> - Font color.		</li>
		<li>
		<b>style</b> - Font style. Valid values: normal, bold, italic, underline. <br />
		You can combine styles, for example, "textStyle.font" : "bold, italic"		</li>
		</ul>
		Here is the example on how to set up parameters with the TextStyle data type. Parameter <a href="Parameters_ui_windows.html#window.caption.textStyle">window.caption.textStyle 
		</a>:
		<br />
		"window.caption.textStyle.color":"#FF00FF"<br />
		"window.caption.textStyle.style":"bold"	</li>
	</ul>
</li>


<li>
<p class="topicLeft" id="hidden"> HiddenMode</p>
Sometimes  you need to use the html user interface instead of FLASH UI to select files, display a file list, etc. In this case you would like to control MultiPowUpload using Java Script API, and you can do almost everything except displaying a browse dialog. It happens because of Adobe Flash security policies which require direct user iteraction with FLASH UI to show the browse dialog. To avoid this problem, MultiPowUpload can be placed over the existing html object in the <a href="Parameters_ui.html#hiddenMode">hiddenMode. </a>
In this mode MUltiPowUpload will display the browse dialog by a mouse click.
 Here are the steps to place a transparent MultiPowUpload instance over the html object:
 <ul>
 <li>
  Set the value of the wmode parameter of &lt;object&gt; or &lt;embed&gt; tag to transparent. </li>
  <li>
  Set the position of the object to absolute. </li>
  <li>
  Set the value of the <a href="Parameters_ui.html#hiddenMode">hiddenMode </a> parameter to true. </li>
   <li>
  Set the value of the <a href="Parameters_ui.html#overlayObjectId">overlayObjectId </a> to ID of the target html object. </li>
 </ul>
 Example:
	<pre>
	var params = {  		
		wmode: "transparent"
	};
	
	var attributes = {  
		id: "MultiPowUpload",  
		name: "MultiPowUpload",
		style:"position:absolute"	
	};
	
	var flashvars = {
	  "uploadUrl": "FileProcessingScripts/PHP/uploadfiles.php",
	  "useExternalInterface": "true",
	  "overlayObjectId":"browseButton",
	  "hiddenMode": "true"	  	  
	};

	swfobject.embedSWF("ElementITMultiPowUpload3.1.swf", "MultiPowUpload_holder", "90", "30", "10.0.0", "Extra/expressInstall.swf", flashvars, params, attributes);
	
	</pre>
 </li>
 <li> <p class="topicLeft" id="thumb">Upload thumbnails</p>
MultiPowUpload can generate image thumbails on the client side and upload them to a server.  Supported image formats are JPEG, PNG, GIF. 
Here are the steps to configure the thumbnails upload feature: 
  <ul>
<li>
First of all, to enable this feature, you should set the value of the <a href="Parameters_function.html#sendThumbnails">sendThumbnails</a> parameter to true.</li>
<li>
If you would like to send original images, set the value of the <a href="Parameters_function.html#sendOriginalImages">sendOriginalImages</a> parameter to true.</li>
<li>
Set the values of the <a href="Parameters_function.html#thumbnail.width">thumbnail.width</a>  and <a href="Parameters_function.html#thumbnail.height">thumbnail.height</a>  parameters. These parameters determine destination dimensions of the resized image.  To set thumbnail's height (width) in percentage from orginal image height (width), set the value as a number from 0.0 to 1.0. For example, to generate a thumbnail with the half-size width, set the value of the <a href="Parameters_function.html#thumbnail.width">thumbnail.width</a> parameter to 0.5. </li>
<li>
You can change the thumbnail format by setting the value of the <a href="Parameters_function.html#thumbnail.format">thumbnail.format</a> parameter. 
MultiPowUpload supports the following image formats for the thumbnail generation: JPG (by default) , PNG.</li>
<li>
Set the value of the <a href="Parameters_function.html#thumbnail.resizeMode">thumbnail.resizeMode</a> parameter. This parameter determines how MultiPowUpload will resize images.
Let's see how it works. For example, we have set the <a href="Parameters_function.html#thumbnail.height">thumbnail.height</a> parameter to 100 pixels and the <a href="Parameters_function.html#thumbnail.width">thumbnail.width</a> parameter to 100 pixels. Here is the source image with  2592x1944 dimensions (4/3 aspect ratio  differs from 100x100 = 1/1):<br />
<img src="images/thumbnail_IMG_0904.JPG" alt="Original image" width="100" height="75" /><br /><br />
Available values:
<p><b>fit</b> - MultiPowUpload will generate  thumbnails with the size based on the aspect ratio of the original image. The result thumbnail dimensions may differ from the <a href="Parameters_function.html#thumbnail.width">thumbnail.width</a> and <a href="Parameters_function.html#thumbnail.height">thumbnail.height</a> parameters if the aspect rato of the original image and the destination thumbnail are different. <br />
  In our example this mode will produce an image with the 100x75 dimensions. The original image is resized by the longest side (in our case - by width). <br /> 
  <img src="images/thumbnail_fit.png" width="100" height="75" /> = <img src="images/thumbnail_IMG_0904.JPG" alt="Original image" width="100" height="75" /></p>
  
  <p><b>fitByWidth</b> -  the result thumbnail will always have specified width. The result thumbnails height calculated with respect of the the aspect ratio of the original image.<br />
In our example this mode will produce an image with the 100x75 dimensions. <br />
    <img src="images/thumbnail_fit.png" width="100" height="75" /> = <img src="images/thumbnail_IMG_0904.JPG" alt="Original image" width="100" height="75" /></p>
	
	<p><b>fitByHeight</b> -  the result thumbnail will always have specified height. The result thumbnails width calculated with respect of the the aspect ratio of the original image.<br />
In our example this mode will produce an image with the 133x100 dimensions. <br />
    <img src="images/thumbnail_fit.png" width="100" height="75" /> = <img src="images/thumbnail_IMG_0904_fitByHeight.JPG" alt="Original image" width="133" height="100" /></p>
	
	
 <p><b>exactFit</b> - the result thumbnail will always have specified dimensions. If the aspect rato of the original image and the destination thumbnail are different, &quot;unused&quot; space of thumbnail is filled with <a href="Parameters_function.html#thumbnail.backgroundColor">thumbnail.backgroundColor</a> color. If the value of the <a href="Parameters_function.html#thumbnail.format">thumbnail.format</a> parameter set to &quot;PNG&quot; and the value of the <a href="Parameters_function.html#thumbnail.transparentBackground">thumbnail.transparentBackground</a> parameter set to true, result thumbnail will have transparent background.<br />
  In our example this mode will produce an image with the 100x100 dimensions. The original image is resized by the longest side (in our case - by width). <br /> 
  <img src="images/thumbnail_fit.png" width="100" height="75" /> = <img src="images/thumbnail_IMG_0904_exactFit.JPG" alt="Original image" width="100" height="100" /></p>

<p><b>stretch</b> - the result thumbnail will always have specified dimensions. If it is necessary, the image is stretched by width or height. <br />
    In our example this mode will produce an image with the 100x100 dimensions. As you can see, the image is stretched by the smallest side (in our case - by height).  <br />
    <img src="images/thumbnail_stretch.png" width="100" height="75" /> = <img src="images/thumbnail_IMG_0904_stretch.JPG" alt="Original image" width="100" height="100" /></p>
	
  <p><b>crop</b> -  the result thumbnail will always have specified dimensions. If it is necessary, the image is cropped by width or height.<br />
    In our example this mode will produce an image with the 100x100 dimensions.  The result image is cropped by the longest side (in our case - by width).<br />
    <img src="images/thumbnail_crop.png" width="100" height="75" /> = <img src="images/thumbnail_IMG_0904_crop.JPG" alt="Original image" width="100" height="100" /></p>	
	
</li>
</ul>
</li>

 <li> <p class="topicLeft" id="chunk">Uploade modes, chunked upload mode.</p>
  By default, MultiPowUpload uploads files by the classic (<a rel="nofollow" target="_blank" title="Form-based File Upload in HTML-RFC 1867" href="http://www.ietf.org/rfc/rfc1867.txt">RFC 1867</a>) method. Here are several disadvantages of this method:
  <ul>
  <li>
  Web server should be configured to handle large file uploads. Some of web hostings do not allow you to change those settings.  </li>
  <li>
	Flash Player has a cookie bug, which lead  to  the session and authentication data loss during the upload. Read more <a href="Troubleshooting.html#session">here</a>.  </li>
  <li>
	Some   antivirus software works as proxy servers and scan all requests to a web server from the user computer. It may result MultiPowUpload to display wrong progress information. The progress bar goes quickly to 99% and stops waiting for a server response.  </li>
  </ul>
    The main advantage of the classic method is the usage of the standard upload algorithm, which allows you to use regular scripts to save uploaded files on server side.<br />
	MultiPowUpload provides an alternate upload method - chunked upload mode. When this mode is enabled, MultiPowUpload will send files to a server by small chunks.<br />
	Here are several advantages of this method: <br />
 <ul>
  <li>
  You do not need to configure the web server for large file uploads, because the file is uploaded by small chunks.  </li>
  <li>
	Flash Player sends browser cookies correctly with this method. The session and authentication info is passed correctly to the server.  </li>
  <li>
	Progress information is always correct.  </li>
  </ul>
  The main disadvantage is the file size limitation: MultiPowUpload can upload  only files up to 100 Mb in size by this method. You should also use a special file processing script on server side to save  uploaded chunks in one file.
   To enable this method,  set the value of the <a href="Parameters_function.html#chunkedUpload.enabled">chunkedUpload.enabled</a>   parameter to true. <br />
	You can configure the chunk size with the <a href="Parameters_function.html#chunkedUpload.chunkSize">chunkedUpload.chunkSize
   
   </a>parameter. By default, the value of this paraneter is set to -1, in this case MultiPowUpload will automatically select the best value for the chunk size during the upload process. To limit maximum value for the chunk size, when it is controlled by MultiPowUpload, you can use the <a href="Parameters_function.html#chunkedUpload.maxChunkSize">chunkedUpload.maxChunkSize</a> parameter. The value of this parameter should be less than the upload file size limitation on server side. For example, by default, php  limit of the upload file size is 2 Mb.<br />
   Additionally, MultiPowUpload has 2 modes for the chuncked upload method:
   <ul>
   <li>
   	<b>raw mode</b>: MultiPowUpload will write the file body by chuncks directly to the request. The request will contain only binary file data and nothing more. To enable this mode, set the value of the <a href="Parameters_function.html#chunkedUpload.rawMethod">chunkedUpload.rawMethod</a> parameter to true (by default). </li>
   <li>
   	<b>multipart mode</b>: MultiPowUPload will encode each chunck using MultiPart encoding. In this case,  each chunk will be present as a file on the server side. It allows to stick  the file parts together easily. To enable this mode, set the value of the <a href="Parameters_function.html#chunkedUpload.rawMethod">chunkedUpload.rawMethod</a> parameter to false. </li>
   </ul>
   
   Here is the comparison table of classic and chunked upload methods:
   <table bgcolor="#F3F3F3" border="1" cellspacing="0" cellpadding="0"	>

  <tr align="center">
	<td>&nbsp;</td>
	<td ><strong>Classic method</strong></td>
	<td ><strong>Chunked method</strong></td>
   </tr>
   <tr align="center">
	<td>File size limit.</td>
	<td >2 Gb</td>
	<td > Adobe Flash guarantees 100 MB files uploading by this method but   even 500 MB files work correctly on most PCs.</td>
   </tr>
   <tr align="center">
	<td>Cookies are sent correctly.</td>
	<td >No</td>
	<td >Yes</td>
   </tr>
   <tr align="center">
	<td>Server should be configured for large file uploads.</td>
	<td >Yes</td>
	<td >No</td>
   </tr>
    <tr align="center">
	<td>Server side file processing script.</td>
	<td >Standard</td>
	<td >Custom script from the distribution package</td>
   </tr>
   </table>
</li>
<li>
<p class="topicLeft" id="skin">Skinning UI</p>
MultiPowUpload provides the possibility to set colors, text styles, icons for most of UI elements and even replace them with the custom image files.
To combine all of those parameters in one place, you can use the MultiPowUpload theme package.<br />
The MultiPowUpload theme package is a simple zip archive, which should contain an xml file with the parameters named theme.xml and the image files if it is necessary.<br />
The Xml file may contain any MultiPowUpload parameters. The Url to the image files inside the theme archive is relative to the archive root. All files should be placed into the archive root. You can find an example of the theme packages in the distribution package.<br />
Specify the url to the theme package using the <a href="Parameters_ui.html#themeUrl">themeUrl</a> parameter.<br />
Along with the theme package you can set all of the skin related parameters in a regular way, on the html page. <br />
 You can set graphics for states almost for all UI elements: normal, disabled, roll over, down.
It is usually enough to specify an image file only for the normal state, then MultiPowUpload will generate the additional image for the disabled state automatically and will use the normal state image for other states.</li>

<li>
<p class="topicLeft" id="description">Form fields for each file. Configuring description window.</p>
MultiPowUpload allows to have the feature to set up form fields for each file. It may be helpful if you would like to have a description for each file or some other information. <br />
For example, you have an image gallery and it  would be nice to have information about album, some comments for image, tags, etc. for each image file.<br />
MultiPowUpload is easy to configure to show all of these form fields.<br />
First of all, let's see how it works. The description windows can be called from the list or the thumbnails view:
<br />

<img src="images/ListItem.png" width="445" height="43"  /><br />

Set the value of the <a href="Parameters_ui_fileView.html#listView.description.visible">listView.description.visible</a> parameter to true (false by default) to  display the line with a description in the ListView.<br />

<img src="images/ThumbItem.png" width="121" height="121"  /><br />

Set the value of the <a href="Parameters_ui_fileView.html#thumbnailView.bottomPanel.showEditIcon">thumbnailView.bottomPanel.showEditIcon </a>parameter to true (false by default) to  display this icon  in the ThumbnailsView.<br />

When a user clicks some of those controls, MultiPowUpload displays the Description window:<br />
<img src="ui_screenshots/DescriptionWindow.png"  /><br />
Using this window, a user can navigate through all the available form fields for each file. <br />
 The navigationPanel is placed on the top of this window. This panel allows to change the active file without closing the window. A user simply clicks on the navigation buttons. Use the <a href="Parameters_ui_windows.html#descriptionWindow.fileNavigation.enabled">descriptionWindow.fileNavigation.enabled</a> parameter to enable or disable this panel. <br />
The inputsList is located on the left side. This list contains all the configured form fields. Click  some of the items in the list to change the rightPanel content, where a user makes an actual input.<br />
To add a form field into the input list, you should set the following required parameters, where * character should be replaced by the form field name. This name will be used by MultiPowUpload to post data. 
<ul>
<li>
<a href="Parameters_ui_windows.html#descriptionWindow.inputs.*.type">descriptionWindow.inputs.*.type</a> - Input type. valid values:<br />
 "dropdown" - Drop down select list.  dropDownOptions should be specified by this type.<br />
 "singleline" - a simple single line input.<br />
 "multiline" - a simple multiline text input.</li>
<li>
<a href="Parameters_ui_windows.html#descriptionWindow.inputs.*.index">descriptionWindow.inputs.*.index</a> - an index of a form field in the inputsList.</li>
<li>
<a href="Parameters_ui_windows.html#descriptionWindow.inputs.*.label">descriptionWindow.inputs.*.label</a> - a label displayed in the inputsList.</li>
<li>
<a href="Parameters_ui_windows.html#descriptionWindow.inputs.*.message">descriptionWindow.inputs.*.message</a> - a string displayed on the right panel.</li>
<li>
<a href="Parameters_ui_windows.html#descriptionWindow.inputs.*.specificForTypes">descriptionWindow.inputs.*.specificForTypes</a> - an array of the file types for which this input field will be displayed. The separator is ";" character. <br />
Example: .jpg;.png".<br /> 
If the parameter is empty, the form field is displayed for all files.</li>
<li>
<a href="Parameters_ui_windows.html#descriptionWindow.inputs.*.dropDownOptions">descriptionWindow.inputs.*.dropDownOptions</a> - an array of the drop down items. It is used if  descriptionWindow.inputs.*.type  parameter is set to "dropdown". The separator is ";" character.
<br />
Example: "choose me;select me"</li>
</ul>
Here is the configuration for the form field displayed on the screenshot below:
<pre>    &quot;descriptionWindow.inputs.album.type&quot;:&quot;dropdown&quot;,<br />	  &quot;descriptionWindow.inputs.album.index&quot;:&quot;2&quot;,<br />	  &quot;descriptionWindow.inputs.album.specificForTypes&quot;:&quot;&quot;,<br />	  &quot;descriptionWindow.inputs.album.dropDownOptions&quot;:&quot;Family;Friens;Other&quot;,<br />	  &quot;descriptionWindow.inputs.album.label&quot;:&quot;Album&quot;,<br />	  &quot;descriptionWindow.inputs.album.message&quot;:&quot;Select album for image&quot;
</pre>
This form field will be posted to server with the "album" name, so on server side you can access its value like this: Request.Form["album"] (ASP.NET) or $_POST["album"] (PHP).</li>
<li>
<p class="topicLeft" id="response_control">Control MultiPowUpload using server response.</p>
Starting from version 3.1, MultiPowUpload  supports the execution of some commands received from a server in an http response. <br />
To use this feature, you should write a special xml structure at any place of the response.
MultiPowUpload will search for &lt;MultiPowUpload&gt; and &lt;/MultiPowUpload&gt; tags in the server response and, if they are found, will try execute a command between these 2 tags.<br />
Below is the valid xml structure with all commands that are supported in the current version:
<pre>
&lt;MultiPowUpload&gt;
//display message with caption &quot;Warning&quot; message from tag<br />&lt;message&gt;Uploaded&lt;/message&gt;<br />//set value of parameter<br />&lt;param name=&quot;clearButtonVisible&quot;&gt;false&lt;/param&gt;<br />//display message with specified caption and message<br />&lt;function name=&quot;showAlert&quot; param1=&quot;warning&quot; param2=&quot;error message&quot;/&gt;<br />//cancell upload<br />&lt;callfunction name=&quot;cancelUpload&quot;/&gt;<br />&lt;/MultiPowUpload&gt;
</pre>
Here is the decription of all available tags (commands):
<ul>
<li>
&lt;function name=&quot;functionName&quot; param1=&quot;value1&quot; param2=&quot;value2&quot;/&gt;<br />
 or<br />
&lt;callfunction name=&quot;functionName&quot; param1=&quot;value1&quot; param2=&quot;value2&quot;/&gt; - call function with the name specified in the name attribute and 2 parameters (if they are set) from param1 and param2 attributes.<br />
Available functions to call: 
<ul>
<li>
showAlert is with 2 parameters. The first parameter will be used as a caption for the modal window, the second parameter - as message text.</li>
<li>
cancelUpload is without any parameter.  The parameter cancels the upload operation.</li>
</ul>
</li>
<li>
&lt;message&gt;Your text here&lt;/message&gt; - It shows a modal window with the "Warning" caption  and a message from the tag contents.</li>
<li> </li>
&lt;param name=&quot;parameterName&quot;&gt;parameterValue&lt;/param&gt; - It sets the value of a parameter with the specified name.
</ul>
</li>
<li>
<p class="topicLeft" id="international">Internationalization of UI.</p>
Starting from version 3.1, MultiPowUpload provides the feature to detect a user's language automatically and load an necessary file with the translation.
This feature can be enabled/disabled using the <a href="Parameters_ui.html#language.autoDetect">language.autoDetect</a> parameter  (false by deafult). If the parameter is set to true, MultiPowUpload will try to detect the user's language using the following JavaScript  statement: <code>(navigator.language) ? navigator.language : navigator.userLanguage</code>. When the language is detected, the 2-letter language code will replace &lt;LANGUAGE_CODE&gt; placeholder in the <a href="Parameters_ui.html#language.source">language.source</a> parameter. If the value of  <a href="Parameters_ui.html#language.source">language.source</a> parameter
 does not contain 
&lt;LANGUAGE_CODE&gt; placeholder, the language detection will not be performed. If the value of the <a href="Parameters_ui.html#language.autoDetect">language.autoDetect</a> parameter  is set to false and 
 the value of the <a href="Parameters_ui.html#language.source">language.source</a> parameter 
 contains &lt;LANGUAGE_CODE&gt; placeholder, the language detection will not be performed and the <a href="Parameters_ui.html#language.source">language.source</a> parameter will be ignored. 
 <br />
 The MultiPowUpload distribution package contains a lot of translation files in the Extra/Languages/ subfolder. <br />
 If you would like to set the translation manually, you should set  the value of the <a href="Parameters_ui.html#language.autoDetect">language.autoDetect</a> parameter to false and remove the &lt;LANGUAGE_CODE&gt; placeholder from the <a href="Parameters_ui.html#language.source">language.source</a> parameter. <br />
Changing the value of the <a href="Parameters_ui.html#language.source">language.source</a> parameter at runtime using the <a href="Methods.html#setParameter">setParameter</a> method will result the reload of the translation file from the new location and the reinitialization of MultiPowUpload.<br />
</li>
  <li><p class="topicLeft" id="layout">Auto layout. Relative coordinates.</p>
      <p>To fit UI elements sizes to a dinamic text, MultiPowUpload have the <a href="Parameters_ui.html#autoLayout">autoLayout</a> parameter which is enabled by default. When the value of this parameter is set to true, MultiPowUpload will automatically adjust the width and the height of the buttons depending on the text size and reposition all UI elements if their coordinates has been set as relative. 
        You can set the position of almost all UI elements, but  dimensions of UI elements sometimes change at runtime (loading different translation files) and they overlap other UI elements. To avoid this issue, MultiPowUpload (starting from 3.1 version) allows to set the position of the UI elements relatively to the position  of another UI element.
        You can use ariphmetic operations and special placeholders inside the values of the parameters that set coordinates of some UI element. 
        Here is syntax of placeholder: 
        <strong>&lt;ui_Element_Name.property&gt;</strong> - where <strong>ui_Element_Name</strong> is a name of a UI element, for example, clearButton, and <strong>property</strong> is one of the Rectangled properties.<br />
          <strong>ui_Element_Name</strong> can have one of the values listed below:<br />
      </p>
    <ul>
      <li> browseButton</li>
      <li> uploadButton</li>
      <li> removeButton</li>
      <li> clearButton</li>
      <li> cancelButton</li>
      <li> listViewButton</li>
      <li> sortButton</li>
      <li> thumbViewButton</li>
      <li> browseLabel</li>
      <li> statusLabel</li>
      <li> progressBar</li>
      <li>fileView</li>
    </ul>
    <p>The <strong>property</strong> can have one of the following values:    </p>
    <ul>
      <li> x - horizontal coordinate. </li>
      <li> y - vertical coordinate. </li>
      <li> width - width of the UI element. </li>
      <li> height - height of the UI element. </li>
      <li> left - coordinate of the left border. The same as x. </li>
      <li> right - coordinate of the right border The same as x+width. </li>
      <li> top - coordinate of the top border. The same as y. </li>
      <li> bottom - coordinate of the right border. The same as y+height.</li>
    </ul>   
      Example :<br />
      <strong>&quot;clearButton.x&quot; : &quot;&lt;movie.width&gt;-&lt;clearButton.width&gt;-5&quot;</strong> - it sets the horizontal position of the clearButton  aligned to the right border of the movie clip. <br />
  </li>
</ol>

</body>
</html>